
var sm = new Vue({
    el: "#messagestatistic",
    data: function () {
        return {
            msg_consult_data: [{
                key: '总数',
                value: '1000人'
            }, {
                key: '已查阅',
                value: '1000人'
            }, {
                key: '未查阅',
                value: '1000人'
            }, {
                key: '查阅率',
                value: '1000人'
            }],
            visible: true
        }
    }
})
// 基于准备好的dom，初始化echarts实例
var consultChart = echarts.init(document.getElementById('msg-consult-chart'));
var confirmChart = echarts.init(document.getElementById('msg-confirm-chart'));
var sendChart = echarts.init(document.getElementById('msg-send-chart'));
var replyChart = echarts.init(document.getElementById('msg-reply-chart'));
// 指定图表的配置项和数据
option = {
    title:{
        text:'查阅率',
        subtext:'70%',
        left:'center',
        top:'42%',
        itemGap:5,
        textStyle:{
            color:'#141f1f',
            fontSize:12
        },
        subtextStyle:{
            color:'#0072e6',
            fontSize:18,
            fontWeight:'bold'
        }
    },
    color:['#0072e6', '#d7d7c1'],
    series: [
        {
            name:'消息',
            type:'pie',
            radius: ['41%', '50%'],
            label: {
                normal: {
                    formatter: '{b|{b}}\n{c}人',
                    rich: {
                        b: {
                            fontSize: 12,
                            lineHeight: 20
                        }
                    }
                }
            },
            data:[
                {value:335, name:'已查阅'},
                {value:100, name:'未查阅'},
            ]
        }
    ]
};
// 使用刚指定的配置项和数据显示图表。
consultChart.setOption(option);
confirmChart.setOption(option);
sendChart.setOption(option);
replyChart.setOption(option);


